/*
 * @Author: xiaosihan 
 * @Date: 2023-08-10 11:24:00 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-12-25 09:02:18
 */

.toolClothColor {
  position: relative;
  background-color: #F2F3F7;
  padding: 0px 4px;
  width: 100%;
  border-radius: 4px;
  text-align: left;
  display: none;
  text-align: center;
  user-select: none;

  &.visible {
    display: inline-block;
  }

  .lable {
    vertical-align: middle;
  }

  .colorBlock {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 6px;
    border-radius: 2px;
    border: 2px solid #cccccc;
    vertical-align: middle;
    cursor: pointer;
    border-radius: 20px;

    &.active {
      margin: 4px;
      border: 4px solid #1677FF;
    }
  }

  .apply_all {
    background-color: #FFE5CF;
    color: #F37F18 !important;
    cursor: pointer;
    font-size: 14px;
    padding: 2px 8px;
    border-radius: 4px;
    vertical-align: middle;
    border: 1px solid #f7ddd3;

    &:hover {
      border: 1px solid #F10505;
    }
  }


}

.color_picker {
  .SketchPicker {
    user-select: none;
  }
}